<script>
	export default {
		onLaunch: function() {
			console.log('App Launch')
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>

<style lang="scss">
	/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
	@import "uview-ui/index.scss";

	/*每个页面公共css */

	/*每个页面公共css */
	view,
	image,
	button,
	text,
	input,
	textarea,
	swiper,
	scroll-view {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		font-family: PingFang SC, PingFang SC 微软雅黑;
	}

	.flex_box {
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
		width: 100%;
	}

	.flex_box .item {
		display: block;
		-webkit-box-flex: 1;
		-webkit-flex: 1;
		flex: 1;
	}

	/**flex 设置**/
	.fldr {
		flex-direction: row;
		-webkit-flex-direction: row;
	}

	.fldc {
		flex-direction: column;
		-webkit-flex-direction: column;
	}

	.fldrr {
		flex-direction: row-reverse;
		-webkit-flex-direction: column-reverse
	}

	.jcsb {
		justify-content: space-between;
		-webkit-justify-content: space-between;
	}

	.jcsba {
		justify-content: space-around;
		-webkit-justify-content: space-around;
	}

	.jcfs {
		justify-content: flex-start;
		-webkit-justify-content: flex-start;
	}

	.jcc {
		justify-content: center;
		-webkit-justify-content: center
	}

	.jcfe {
		justify-content: flex-end;
		-webkit-justify-content: flex-end
	}

	.df {
		display: -webkit-flex;
		display: flex
	}

	.dif {
		display: inline-flex;
	}

	.aic {
		align-items: center;
	}

	.aie {
		align-items: flex-end;
	}

	.jcc {
		justify-content: center;
	}

	.fw {
		flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
	}

	.clamp_1 {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
		text-overflow: ellipsis;
		display: box;
		box-orient: vertical;
		line-clamp: 1;
		overflow: hidden;
	}

	.clamp_2 {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		text-overflow: ellipsis;
		display: box;
		box-orient: vertical;
		line-clamp: 2;
		overflow: hidden;
	}

	.clamp_3 {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		text-overflow: ellipsis;
		display: box;
		box-orient: vertical;
		line-clamp: 3;
		overflow: hidden;
	}

	.clamp_4 {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 4;
		text-overflow: ellipsis;
		display: box;
		box-orient: vertical;
		line-clamp: 4;
		overflow: hidden;
	}

	.ell {
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}

	.vm {
		vertical-align: middle;
	}

	.vt {
		vertical-align: top;
	}

	/**字体**/
	.fs0 {
		font-size: 0;
	}

	.fs12 {
		font-size: 12rpx;
	}

	.fs14 {
		font-size: 14rpx;
	}

	.fs16 {
		font-size: 16rpx;
	}

	.fs18 {
		font-size: 18rpx;
	}

	.fs20 {
		font-size: 20rpx;
	}

	.fs22 {
		font-size: 22rpx;
	}

	.fs24 {
		font-size: 24rpx;
	}

	.fs26 {
		font-size: 26rpx;
	}

	.fs28 {
		font-size: 28rpx;
	}

	.fs30 {
		font-size: 30rpx;
	}

	.fs32 {
		font-size: 32rpx;
	}

	.fs34 {
		font-size: 34rpx;
	}

	.fs36 {
		font-size: 36rpx;
	}

	.fs38 {
		font-size: 38rpx;
	}

	.fs40 {
		font-size: 40rpx;
	}

	.fs42 {
		font-size: 42rpx;
	}

	.fs44 {
		font-size: 44rpx;
	}

	.fs46 {
		font-size: 46rpx;
	}

	.fs48 {
		font-size: 48rpx;
	}

	.fs50 {
		font-size: 50rpx;
	}

	.fs54 {
		font-size: 54rpx;
	}

	.fs58 {
		font-size: 58rpx;
	}

	.fs60 {
		font-size: 60rpx;
	}

	.fs66 {
		font-size: 66rpx;
	}

	.fs68 {
		font-size: 68rpx;
	}

	.fs70 {
		font-size: 70rpx;
	}

	.fs84 {
		font-size: 84rpx;
	}

	.fs100 {
		font-size: 100rpx;
	}

	/* 行高 */
	.lh1 {
		line-height: 1
	}

	.lh50 {
		line-height: 50rpx;
	}

	.lh48 {
		line-height: 48rpx;
	}

	.lh44 {
		line-height: 44rpx;
	}

	.lh40 {
		line-height: 40rpx;
	}

	.lh38 {
		line-height: 38rpx;
	}

	.lh36 {
		line-height: 36rpx;
	}

	.lh34 {
		line-height: 34rpx;
	}

	.lh30 {
		line-height: 30rpx;
	}

	.lh32 {
		line-height: 32rpx;
	}

	.lh28 {
		line-height: 28rpx;
	}

	.lh26 {
		line-height: 26rpx;
	}

	.lh80 {
		line-height: 80rpx;
	}

	.lh70 {
		line-height: 70rpx;
	}

	.lh60 {
		line-height: 60rpx;
	}

	/**距离 marging **/
	.mt5 {
		margin-top: 5rpx;
	}

	.mt10 {
		margin-top: 10rpx;
	}

	.mt12 {
		margin-top: 12rpx;
	}

	.mt15 {
		margin-top: 15rpx;
	}

	.mt20 {
		margin-top: 20rpx;
	}

	.mt25 {
		margin-top: 25rpx;
	}

	.mt30 {
		margin-top: 30rpx;
	}

	.mt35 {
		margin-top: 35rpx;
	}

	.mt40 {
		margin-top: 40rpx;
	}

	.mt45 {
		margin-top: 45rpx;
	}

	.mt50 {
		margin-top: 50rpx;
	}

	.mt55 {
		margin-top: 55rpx;
	}

	.mt60 {
		margin-top: 60rpx;
	}

	.mt78 {
		margin-top: 78rpx;
	}

	.mb5 {
		margin-bottom: 5rpx;
	}

	.mb10 {
		margin-bottom: 10rpx;
	}

	.mb15 {
		margin-bottom: 15rpx;
	}

	.mb20 {
		margin-bottom: 20rpx;
	}

	.mb25 {
		margin-bottom: 25rpx;
	}

	.mb30 {
		margin-bottom: 30rpx;
	}

	.mb35 {
		margin-bottom: 35rpx;
	}

	.mb40 {
		margin-bottom: 40rpx;
	}

	.mb45 {
		margin-bottom: 45rpx;
	}

	.mb50 {
		margin-bottom: 50rpx;
	}

	.ml5 {
		margin-left: 5rpx;
	}

	.ml10 {
		margin-left: 10rpx;
	}

	.ml15 {
		margin-left: 15rpx;
	}

	.ml20 {
		margin-left: 20rpx;
	}

	.ml25 {
		margin-left: 25rpx;
	}

	.ml30 {
		margin-left: 30rpx;
	}

	.ml35 {
		margin-left: 35rpx;
	}

	.ml40 {
		margin-left: 40rpx;
	}

	.ml45 {
		margin-left: 45rpx;
	}

	.ml50 {
		margin-left: 50rpx;
	}

	.ml60 {
		margin-left: 60rpx;
	}

	.mr5 {
		margin-right: 5rpx;
	}

	.mr10 {
		margin-right: 10rpx;
	}

	.mr15 {
		margin-right: 15rpx;
	}

	.mr17 {
		margin-right: 17rpx;
	}

	.mr20 {
		margin-right: 20rpx;
	}

	.mr25 {
		margin-right: 25rpx;
	}

	.mr30 {
		margin-right: 30rpx;
	}

	.mr35 {
		margin-right: 35rpx;
	}

	.mr40 {
		margin-right: 40rpx;
	}

	.mr45 {
		margin-right: 45rpx;
	}

	.mr50 {
		margin-right: 50rpx;
	}

	.mar_auto {
		margin-left: auto;
		margin-right: auto;
	}

	.pa10 {
		padding: 10rpx;
	}

	.pa15 {
		padding: 15rpx;
	}

	.pa20 {
		padding: 20rpx;
	}

	.pa25 {
		padding: 25rpx;
	}

	.pa30 {
		padding: 30rpx;
	}

	.pa35 {
		padding: 35rpx;
	}

	.pt5 {
		padding-top: 5rpx;
	}

	.pt10 {
		padding-top: 10rpx;
	}

	.pt15 {
		padding-top: 15rpx;
	}

	.pt20 {
		padding-top: 20rpx;
	}

	.pt25 {
		padding-top: 25rpx;
	}

	.pt30 {
		padding-top: 30rpx;
	}

	.pt35 {
		padding-top: 35rpx;
	}

	.pt40 {
		padding-top: 40rpx;
	}

	.pt45 {
		padding-top: 45rpx;
	}

	.pt50 {
		padding-top: 50rpx;
	}

	.pt55 {
		padding-top: 55rpx;
	}


	.pt80 {
		padding-top: 80rpx;
	}

	.pb5 {
		padding-bottom: 5rpx;
	}

	.pb10 {
		padding-bottom: 10rpx;
	}

	.pb15 {
		padding-bottom: 15rpx;
	}

	.pb20 {
		padding-bottom: 20rpx;
	}

	.pb25 {
		padding-bottom: 25rpx;
	}

	.pb30 {
		padding-bottom: 30rpx;
	}

	.pb35 {
		padding-bottom: 35rpx;
	}

	.pb40 {
		padding-bottom: 40rpx;
	}

	.pb45 {
		padding-bottom: 45rpx;
	}

	.pb50 {
		padding-bottom: 50rpx;
	}

	.pl5 {
		padding-left: 5rpx;
	}

	.pl10 {
		padding-left: 10rpx;
	}

	.pl15 {
		padding-left: 15rpx;
	}

	.pl20 {
		padding-left: 20rpx;
	}

	.pl25 {
		padding-left: 25rpx;
	}

	.pl30 {
		padding-left: 30rpx;
	}

	.pl35 {
		padding-left: 35rpx;
	}

	.pl40 {
		padding-left: 40rpx;
	}

	.pl45 {
		padding-left: 45rpx;
	}

	.pl50 {
		padding-left: 50rpx;
	}

	.pl60 {
		padding-left: 60rpx;
	}

	.pr5 {
		padding-right: 5rpx;
	}

	.pr10 {
		padding-right: 10rpx;
	}

	.pr15 {
		padding-right: 15rpx;
	}

	.pr20 {
		padding-right: 20rpx;
	}

	.pr25 {
		padding-right: 25rpx;
	}

	.pr30 {
		padding-right: 30rpx;
	}

	.pr35 {
		padding-right: 35rpx;
	}

	.pr40 {
		padding-right: 40rpx;
	}

	.pr45 {
		padding-right: 45rpx;
	}

	.pr50 {
		padding-right: 50rpx;
	}

	.pr60 {
		padding-right: 60rpx;
	}

	.bgf {
		background-color: #fff;
	}

	.bg_000 {
		background-color: #000;
	}

	.bg1 {
		background-color: #F3F4F7;
	}

	.bg2 {
		background: #f9f9f9;
	}

	.bg3 {
		background: #f5f5f5;
	}

	.fwb {
		font-weight: bold;
	}

	.re {
		position: relative;
	}

	.dn {
		display: none;
	}

	.db {
		display: block;
	}

	.vh {
		visibility: hidden;
	}

	.scaley_1 {
		position: relative;
	}

	.scaley_1:after {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		background: #eeeded;
		content: '';
		height: 1px;
		-webkit-transform: scaleY(.5);
		transform: scaleY(.5);
	}

	.wp100 {
		width: 100%;
	}

	.wp50 {
		width: 50%;
	}

	.wp25 {
		width: 25%;
	}

	.wp20 {
		width: 20%;
	}

	.w355 {
		width: 355rpx;
	}

	.w325 {
		width: 325rpx;
	}

	.w320 {
		width: 320rpx;
	}

	.w295 {
		width: 295rpx;
	}

	.w190 {
		width: 190rpx;
	}

	.w175 {
		width: 175rpx;
	}

	.w154 {
		width: 154rpx;
	}

	.w150 {
		width: 150rpx;
	}

	.w122 {
		width: 122rpx;
	}

	.w118 {
		width: 118rpx;
	}

	.w128 {
		width: 128rpx;
	}

	.w110 {
		width: 110rpx;
	}

	.w72 {
		width: 72rpx;
	}

	.w64 {
		width: 64rpx;
	}

	.w50 {
		width: 50rpx;
	}

	.w60 {
		width: 60rpx;
	}

	.h60 {
		height: 60rpx;
	}


	.h36 {
		height: 36rpx;
	}

	.h32 {
		height: 32rpx;
	}

	.hp100 {
		height: 100%;
	}

	.br_4 {
		border-radius: 4rpx;
	}

	.h180 {
		height: 180rpx;
	}

	.h140 {
		height: 140rpx;
	}

	.h132 {
		height: 132rpx;
	}

	.h110 {
		height: 110rpx;
	}

	.h100 {
		height: 100rpx;
	}

	.h70 {
		height: 70rpx;
	}

	.mt-30 {
		margin-top: -30rpx;
	}

	.mt-25 {
		margin-top: -25rpx;
	}

	.mt-10 {
		margin-top: -10rpx;
	}


	.ml-10 {
		margin-left: -10rpx;
	}

	.ml-15 {
		margin-left: -15rpx;
	}

	.ml-20 {
		margin-left: -20rpx;
	}

	.ml-30 {
		margin-left: -30rpx;
	}

	.ml-25 {
		margin-left: -25rpx;
	}

	.ml-60 {
		margin-left: -60rpx;
	}

	.mr-18 {
		margin-right: -18rpx;
	}

	.tal {
		text-align: left;
	}

	.tac {
		text-align: center;
	}

	.tar {
		text-align: right;
	}

	.ov {
		overflow: hidden;
	}

	.wwb {
		white-space: normal;
		word-break: break-all;
	}

	.bt1 {
		border-top: 1px solid #eee;
	}

	.bb1 {
		border-bottom: 1px solid #EEEEEE;
	}

	.bb2 {
		border-bottom: 1px solid #f9f9f9;
	}



	.cor_666 {
		color: #666;
	}

	.cor_999 {
		color: #999;
	}

	.cor_333 {
		color: #333;
	}

	.cor_000 {
		color: #000;
	}

	.cor_fff {
		color: #fff;
	}

	.cor_DC1 {
		color: #DC1E1E;
	}

	.cor_004 {
		color: #004189;
	}

	.cor_555 {
		color: #555;
	}

	.cor_CED {
		color: #CED7E3;
	}

	.cor_D93 {
		color: #D93467;
	}

	.cor_E85 {
		color: #E85757;
	}

	.cor_B62 {
		color: #B62729;
	}

	.cor_1fd {
		color: #1fd7b9;
	}

	.cor_ff3 {
		color: #ff3300;
	}

	.cor_E79 {
		color: #E791DF;
	}

	.cor_lin_ga_1 {
		background: linear-gradient(140deg, #019EF8 0%, #30DBBB 100%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.cor_lin_ga_2 {
		background: linear-gradient(140deg, #30DBBB 0%, #019EF8 100%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.cor_E5B {
		color: #E5B786;
	}

	.cor_FFD {
		color: #FFDB94;
	}

	.cor_FFE {
		color: #FFEDD7;
	}

	.img1 {
		width: 196rpx;
		height: 88rpx;
	}

	.img2 {
		width: 114rpx;
		height: 114rpx;
	}

	.img3 {
		width: 48rpx;
		height: 48rpx;
	}

	.img4 {
		width: 28rpx;
		height: 28rpx;
	}

	.img5 {
		width: 22rpx;
		height: 22rpx;
	}

	.img6 {
		width: 42rpx;
		height: 42rpx;
	}

	.img7 {
		width: 34rpx;
		height: 34rpx;
	}

	.img72 {
		width: 44rpx;
		height: 44rpx;
	}

	.img8 {
		width: 76rpx;
		height: 76rpx;
		border-radius: 50%;
	}

	.img9 {
		width: 92rpx;
		height: 92rpx;
	}

	.img10 {
		width: 20rpx;
		height: 20rpx;
	}

	.img11 {
		width: 24rpx;
		height: 24rpx;
	}

	.img12 {
		width: 150rpx;
		height: 150rpx;
		border-radius: 8rpx;
	}

	.img13 {
		width: 120rpx;
		height: 120rpx;
		border-radius: 8rpx;
	}

	.img14 {
		width: 26rpx;
		height: 26rpx;
	}

	.img15 {
		width: 32rpx;
		height: 32rpx;
	}

	.img16 {
		width: 40rpx;
		height: 40rpx;
	}

	.img17 {
		width: 52rpx;
		height: 52rpx;
	}

	.img18 {
		width: 144rpx;
		height: 144rpx;
		border-radius: 8rpx;
	}

	.img16 {
		width: 116rpx;
		height: 116rpx;
		border-radius: 50%;
	}



	.img20 {
		width: 68rpx;
		height: 68rpx;
		border-radius: 50%;
		vertical-align: top;
	}

	.img21 {
		width: 72rpx;
		height: 72rpx;
		vertical-align: top;
	}

	.img22 {
		width: 120rpx;
		height: 118rpx;
		vertical-align: top;
	}

	.img23 {
		width: 80rpx;
		height: 80rpx;
		// border: 2rpx solid #eee;
		border-radius: 50%;
	}

	.img24 {
		width: 20rpx;
		height: 12rpx;
		vertical-align: top;
	}

	.img25 {
		width: 36rpx;
		height: 36rpx;
		vertical-align: top;
	}

	.img26 {
		width: 166rpx;
		height: 166rpx;
		vertical-align: top;
	}


	.box {
		line-height: 1;
	}

	.nav_scroll_x,
	.nav_scroll_x_2 {
		position: relative;
		height: 57rpx;
		white-space: nowrap;
	}

	.nav_scroll_x .nav_item,
	.nav_scroll_x_2 .nav_item {
		position: relative;
		display: inline-flex;
		min-width: 64rpx;
		padding: 0 10rpx;
		margin-right: 35rpx;
		line-height: 57rpx;
		text-align: center;
		font-size: 28rpx;
		color: #555;
	}

	.nav_scroll_x .nav_item .icon_arw,
	.nav_scroll_x_2 .nav_item .icon_arw {
		display: inline-block;
		width: 28rpx;
		height: 28rpx;
		background: url(static/icon_arw_1.png) no-repeat;
		background-size: 28rpx;
	}

	.nav_scroll_x .active.nav_item .icon_arw,
	.nav_scroll_x_2 .active.nav_item .icon_arw {
		background: url(static/icon_arw_2.png) no-repeat;
		background-size: 28rpx;
	}

	.nav_scroll_x .active.nav_item,
	.nav_scroll_x_2 .active.nav_item {
		font-weight: bold;
		color: #000;
		font-size: 32rpx;
	}

	.nav_scroll_x .active.nav_item::after,
	.nav_scroll_x_2 .active.nav_item::after {
		content: "";
		position: absolute;
		bottom: 0;
		left: 50%;
		width: 64rpx;
		height: 10rpx;
		background: linear-gradient(132deg, #22DDB2 0%, #009FF5 100%);
		border-radius: 5rpx;
		z-index: 2;
		transform: translateX(-50%);
	}

	.nav_scroll_x_2 .active.nav_item::after {
		display: none;
	}

	.waterfall_flow_box {
		// column-count: 2; //多列的列数
		// column-gap: 18rpx;//列间距
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: space-between;
	}

	.waterfall_flow_box .flow_item {
		// break-inside: avoid;
		padding-top: 20rpx;
	}

	.list_box {
		position: relative;
		width: 336rpx;
		border: 2rpx solid #f9f9f9;
		border-radius: 12rpx;
	}

	.list_box .onself_img_size {
		width: 100%;
		height: 500rpx;
		object-fit: cover;
	}

	.list_box .img_size {
		width: 100%;
		height: 240rpx;
		object-fit: cover;
	}

	.content_h {
		height: 72rpx;
		line-height: 36rpx;
		font-size: 24rpx;
		color: #555;
		text-align: left;
		overflow: hidden;
	}

	.tags_pos {
		position: absolute;
		top: 0;
		left: 0;
		padding: 0 18rpx;
		height: 40rpx;
		line-height: 40rpx;
		font-size: 20rpx;
		color: #fff;
		background: rgba(0, 0, 0, 0.38);
		border-radius: 12rpx 0px 12rpx 0px;
		z-index: 2;
	}

	.tags_pos_2 {
		position: absolute;
		top: 12rpx;
		right: 18rpx;
		padding: 0 15rpx;
		height: 36rpx;
		font-size: 20rpx;
		color: #FCAE32;
		background: #FFF4E1;
		border-radius: 18rpx;
		border: 2rpx solid #FFEDD0;
	}

	.tags_pos_3 {
		position: absolute;
		right: 12rpx;
		bottom: 12rpx;
		padding: 0 12rpx;
		height: 28rpx;
		line-height: 28rpx;
		font-size: 20rpx;
		color: #fff;
		background: rgba(0, 0, 0, 0.38);
		border-radius: 14rpx;
		z-index: 2;
	}

	.label_1 {
		display: block;
		padding: 0 12rpx;
		height: 28rpx;
		line-height: 28rpx;
		font-size: 20rpx;
		color: #555;
		background-color: #F3F4F7;
		border-radius: 4rpx;
		margin-right: 8rpx;
	}

	.top_box_fix {
		position: fixed;
		right: 3%;
		bottom: calc(100rpx + env(safe-area-inset-bottom));
		height: 80rpx;
		width: 80rpx;
		// padding: 0 12rpx;
		background: #FFFFFF;
		box-shadow: 0px 0px 20px 0px rgba(93, 93, 93, 0.5);
		border-radius: 10rpx;
		border: 1px solid #EEEEEE;
		z-index: 972;
		// transform: translateX(-50%);
	}

	.top_box_fix image {
		margin: 15rpx 15rpx;
		width: 50rpx;
		height: 50rpx;
	}

	.menu_box_fix {
		position: fixed;
		left: 50%;
		bottom: calc(185rpx + env(safe-area-inset-bottom));
		height: 76rpx;
		padding: 0 12rpx;
		background: #F9F9F9;
		box-shadow: 0px 0px 20px 0px rgba(93, 93, 93, 0.5);
		border-radius: 38rpx;
		border: 1px solid #EEEEEE;
		z-index: 971;
		transform: translateX(-50%);
	}

	.menu_box_fix .item_menu {
		min-width: 150rpx;
		height: 60rpx;
		line-height: 60rpx;
		text-align: center;
		font-size: 24rpx;
		color: #000;
		background-color: transparent;
		border-radius: 30rpx;
	}

	.menu_box_fix .item_menu.active {
		color: #fff;
		background-color: #000;
	}

	.line_ver_gird {
		position: relative;
		width: 10rpx;
		height: 48rpx;
		background-image: linear-gradient(#22DDB2, #009FF5);
		border-radius: 10rpx;
	}

	.picker_arw_pos {
		position: absolute;
		top: 50%;
		right: 25rpx;
		width: 24rpx;
		height: 24rpx;
		z-index: 2;
		transform: translateY(-50%);
	}

	/* 底部菜单栏 */
	.menu_bottom_fix {
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		padding-top: 46rpx;
		z-index: 971;
	}

	.menu_bottom_fix .top_bg {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 46rpx;
		z-index: 2;
	}

	.menu_bottom_bg {
		position: relative;
		width: 100%;
		padding-bottom: env(safe-area-inset-bottom);
		height: calc(95rpx + env(safe-area-inset-bottom));
		background-color: #fff;
		z-index: 3;
	}

	.menu_add_pos {
		position: absolute;
		top: -28rpx;
		left: 50%;
		width: 68rpx;
		height: 68rpx;
		transform: translateX(-50%);
		z-index: 3;
	}

	/* 底部菜单栏 */


	/* 筛选弹窗 */
	radio,
	checkbox {
		-webkit-transform: scale(0.7);
		transform: scale(0.7);
	}

	/* 自定义导航栏 */
	.navbar {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		background: #fff;
		z-index: 10000;
		overflow: hidden;
	}

	.search_btn_sty {
		position: relative;
		width: 64rpx;
		height: 64rpx;
	}

	.back_prev_btn {
		position: relative;
		top: 50%;
		display: block;
		border-style: solid;
		width: 20rpx;
		height: 20rpx;
		border-width: 6rpx 6rpx 0 0;
		border-color: #fff;
		transform: matrix(-0.71, -0.71, 0.71, -0.71, 0, 0);
		margin-left: 56rpx;
		margin-top: -10rpx;
	}

	// .more_read_h {
	// 	position: relative;
	// 	height: 215rpx;
	// 	overflow: hidden;
	// }

	// .showMore.more_read_h {
	// 	height: auto;
	// }

	.ml-14 {
		margin-left: -14rpx;
	}

	.more_read_h .img_size_list {
		width: 136rpx;
		height: 136rpx;
		border-radius: 16rpx;
		object-fit: cover;
		margin-left: 14rpx;
		margin-bottom: 14rpx;
	}

	.more_read_h .mask_bg_pos {
		position: absolute;
		left: 0;
		bottom: 0;
		padding-bottom: 25rpx;
		display: flex;
		align-items: flex-end;
		justify-content: center;
		width: 100%;
		height: 150rpx;
		background: -webkit-linear-gradient(top, rgba(249, 249, 249, 0) 0%, #F9F9F9 100%);
		z-index: 3;
	}

	.more_read_h .close_mask.mask_bg_pos {
		display: none;
	}

	.more_read_h .mask_bg_pos .more_img {
		width: 32rpx;
		height: 32rpx;
	}

	.live {
		width: 94%;
		height: 180rpx;
		background-color: #000000;
		margin-left: 3%;
		border-radius: 15rpx;
		margin-top: 20rpx;
		overflow: hidden;
		position: relative;
	}

	.live image {
		display: block;
		width: 100%;
		height: 180rpx;
	}

	.livebox {
		position: absolute;
		left: 0px;
		top: 0px;
		width: 100%;
		height: 180rpx;
		padding: 10rpx 10rpx 0 225rpx;
		z-index: 2;
	}

	.live_title {
		width: 100%;
		color: #fff;
		padding-left: 90rpx;
		padding-top: 15rpx;
		font-size: 30rpx;
		line-height: 36rpx;
	}

	.live_footer {
		width: 100%;
		margin-left: 90rpx;
		margin-top: 40rpx;
	}

	.live_footer image {
		width: 240rpx;
		height: 40rpx;
	}

	.live_audio {
		display: inline-block;
		float: left;
		margin-left: 15rpx;
	}



	.live_audio view {
		display: inline-block;
		width: 5rpx;
		height: 30rpx;
		line-height: 30rpx;
		margin-left: 5rpx;
		background-color: #fff;
		/* float: left; */
	}

	.first {
		height: 8px;
		animation: first 0.5s linear 0s infinite alternate;
	}

	.second {
		height: 4px;
		animation: second 1s linear 0s infinite alternate;
	}

	.three {
		height: 6px;
		animation: three 0.8s linear 0s infinite alternate;
	}

	.bg_transparent {
		background-color: #333;
		opacity: 0.8;
		color: #FFF;
		border-radius: 20rpx;
		text-align: center;
	}

	@keyframes first {
		0% {
			height: 4px;
		}

		50% {
			height: 8px;
		}

		100% {
			height: 10px;
		}
	}

	@keyframes second {
		0% {
			height: 12px;
		}

		50% {
			height: 9px;
		}

		100% {
			height: 7px;
		}
	}

	@keyframes three {
		0% {
			height: 14px;
		}

		50% {
			height: 12px;
		}

		100% {
			height: 10px;
		}
	}

	/* 直播预告 */
	.live2 {
		display: block;
		height: 180rpx;
		background-color: #000000;
		border-radius: 15rpx;
		margin-top: 20rpx;
		overflow: hidden;
		position: relative;
		margin-left: 30rpx;
		margin-right: 30rpx;
	}

	.live2 image {
		display: block;
		width: 100%;
		height: 180rpx;
	}

	.livebox2 {
		width: 70%;
		height: 180rpx;
		position: absolute;
		right: 0px;
		top: 0px;
	}

	.live_title2 {
		color: #fff;
		// padding-top: 15rpx;
		font-size: 30rpx;
		margin-top: 15rpx;
	}

	.pl40 {
		padding-left: 40rpx;
	}

	.pl45 {
		padding-left: 45rpx;
	}

	.pl50 {
		padding-left: 50rpx;
	}

	.pl60 {
		padding-left: 60rpx;
	}

	.pr5 {
		padding-right: 5rpx;
	}

	.pr10 {
		padding-right: 10rpx;
	}

	.pr15 {
		padding-right: 15rpx;
	}

	.pr20 {
		padding-right: 20rpx;
	}

	.pr25 {
		padding-right: 25rpx;
	}

	.pr30 {
		padding-right: 30rpx;
	}

	.pr35 {
		padding-right: 35rpx;
	}

	.pr40 {
		padding-right: 40rpx;
	}

	.pr45 {
		padding-right: 45rpx;
	}

	.pr50 {
		padding-right: 50rpx;
	}

	.pr60 {
		padding-right: 60rpx;
	}

	.bgf {
		background-color: #fff;
	}

	.bg1 {
		background-color: #F3F4F7;
	}


	.fwb {
		font-weight: bold;
	}

	.re {
		position: relative;
	}

	.dn {
		display: none;
	}

	.db {
		display: block;
	}

	.vh {
		visibility: hidden;
	}

	.scaley_1 {
		position: relative;
	}

	.scaley_1:after {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		background: #eeeded;
		content: '';
		height: 1px;
		-webkit-transform: scaleY(.5);
		transform: scaleY(.5);
	}

	.wp100 {
		width: 100%;
	}

	.wp50 {
		width: 50%;
	}

	.wp33 {
		width: 33.33%;
	}

	.wp25 {
		width: 25%;
	}

	.w355 {
		width: 355rpx;
	}

	.w325 {
		width: 325rpx;
	}

	.w320 {
		width: 320rpx;
	}

	.w190 {
		width: 190rpx;
	}

	.w175 {
		width: 175rpx;
	}

	.w154 {
		width: 154rpx;
	}

	.w150 {
		width: 150rpx;
	}

	.w122 {
		width: 122rpx;
	}

	.w110 {
		width: 110rpx;
	}

	.w64 {
		width: 64rpx;
	}

	.w50 {
		width: 50rpx;
	}

	.hp100 {
		height: 100%;
	}

	.h100 {
		height: 100rpx;
	}

	.h70 {
		height: 70rpx;
	}

	.h64 {
		height: 64rpx;
	}

	.mt-30 {
		margin-top: -30rpx;
	}

	.mt-25 {
		margin-top: -25rpx;
	}

	.ml-10 {
		margin-left: -10rpx;
	}

	.ml-15 {
		margin-left: -15rpx;
	}

	.ml-20 {
		margin-left: -20rpx;
	}

	.ml-25 {
		margin-left: -25rpx;
	}

	.ml-60 {
		margin-left: -60rpx;
	}

	.mr-18 {
		margin-right: -18rpx;
	}

	.tal {
		text-align: left;
	}

	.tac {
		text-align: center;
	}

	.tar {
		text-align: right;
	}

	.ov {
		overflow: hidden;
	}

	.bt1 {
		border-top: 1px solid #eee;
	}

	.bb1 {
		border-bottom: 1px solid #EEEEEE;
	}

	.bb2 {
		border-bottom: 1px solid #f9f9f9;
	}

	.bb3 {
		border-bottom: 2rpx solid #D9D9D9;
	}

	.bb4 {
		border-bottom: 2rpx solid #f7f7f7;
	}

	.cor_666 {
		color: #666;
	}

	.cor_999 {
		color: #999;
	}

	.cor_333 {
		color: #333;
	}

	.cor_000 {
		color: #000;
	}

	.cor_fff {
		color: #fff;
	}

	.cor_DC1 {
		color: #DC1E1E;
	}

	.cor_004 {
		color: #004189;
	}

	.cor_555 {
		color: #555;
	}

	.cor_CED {
		color: #CED7E3;
	}

	.cor_D93 {
		color: #D93467;
	}

	.cor_E85 {
		color: #E85757;
	}

	.cor_009 {
		color: #009ff5;
	}

	.img1 {
		width: 196rpx;
		height: 88rpx;
	}

	.img2 {
		width: 114rpx;
		height: 114rpx;
	}

	.img3 {
		width: 48rpx;
		height: 48rpx;
	}

	.img4 {
		width: 28rpx;
		height: 28rpx;
	}

	.img5 {
		width: 22rpx;
		height: 22rpx;
	}

	.img6 {
		width: 42rpx;
		height: 42rpx;
	}

	.img7 {
		width: 34rpx;
		height: 34rpx;
	}

	.img72 {
		width: 44rpx;
		height: 44rpx;
	}

	.img8 {
		width: 76rpx;
		height: 76rpx;
		border-radius: 50%;
	}

	.img9 {
		width: 92rpx;
		height: 92rpx;
	}

	.img10 {
		width: 20rpx;
		height: 20rpx;
	}

	.img11 {
		width: 24rpx;
		height: 24rpx;
	}

	.img12 {
		width: 150rpx;
		height: 150rpx;
		border-radius: 8rpx;
	}

	.img13 {
		width: 120rpx;
		height: 120rpx;
		border-radius: 8rpx;
	}

	.img14 {
		width: 26rpx;
		height: 26rpx;
	}

	.img15 {
		width: 32rpx;
		height: 32rpx;
	}

	.img16 {
		width: 40rpx;
		height: 40rpx;
	}

	.img17 {
		width: 52rpx;
		height: 52rpx;
	}

	.img18 {
		width: 144rpx;
		height: 144rpx;
		border-radius: 8rpx;
	}

	.img19 {
		width: 116rpx;
		height: 116rpx;
		border-radius: 50%;
	}

	.nav_scroll_x,
	.nav_scroll_x_2 {
		position: relative;
		height: 57rpx;
		white-space: nowrap;
	}

	.nav_scroll_x .nav_item,
	.nav_scroll_x_2 .nav_item {
		position: relative;
		display: inline-flex;
		min-width: 64rpx;
		padding: 0 10rpx;
		margin-right: 35rpx;
		line-height: 57rpx;
		text-align: center;
		font-size: 28rpx;
		color: #555;
	}

	.nav_scroll_x .nav_item .icon_arw,
	.nav_scroll_x_2 .nav_item .icon_arw {
		display: inline-block;
		width: 28rpx;
		height: 28rpx;
		background: url(static/icon_arw_1.png) no-repeat;
		background-size: 28rpx;
	}

	.nav_scroll_x .active.nav_item .icon_arw,
	.nav_scroll_x_2 .active.nav_item .icon_arw {
		background: url(static/icon_arw_2.png) no-repeat;
		background-size: 28rpx;
	}

	.nav_scroll_x .active.nav_item,
	.nav_scroll_x_2 .active.nav_item {
		font-weight: bold;
		color: #000;
		font-size: 32rpx;
	}

	.nav_scroll_x .active.nav_item::after,
	.nav_scroll_x_2 .active.nav_item::after {
		content: "";
		position: absolute;
		bottom: 0;
		left: 50%;
		width: 64rpx;
		height: 10rpx;
		background: linear-gradient(132deg, #22DDB2 0%, #009FF5 100%);
		border-radius: 5rpx;
		z-index: 2;
		transform: translateX(-50%);
	}

	.nav_scroll_x_2 .active.nav_item::after {
		display: none;
	}

	.waterfall_flow_box {
		// column-count: 2; //多列的列数
		// column-gap: 18rpx;//列间距
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: space-between;
	}

	.waterfall_flow_box .flow_item {
		// break-inside: avoid;
		padding-top: 20rpx;
	}

	.list_box {
		position: relative;
		width: 336rpx;
		border: 2rpx solid #f9f9f9;
		border-radius: 12rpx;
	}

	.list_box .onself_img_size {
		width: 100%;
		height: 500rpx;
		object-fit: cover;
	}

	.list_box .img_size {
		width: 100%;
		height: 240rpx;
		object-fit: cover;
	}

	.content_h {
		height: 72rpx;
		line-height: 36rpx;
		font-size: 24rpx;
		color: #555;
		text-align: left;
		overflow: hidden;
	}

	.tags_pos {
		position: absolute;
		top: 0;
		left: 0;
		padding: 0 18rpx;
		height: 40rpx;
		line-height: 40rpx;
		font-size: 20rpx;
		color: #fff;
		background: rgba(0, 0, 0, 0.38);
		border-radius: 12rpx 0px 12rpx 0px;
		z-index: 2;
	}

	.tags_pos_2 {
		position: absolute;
		top: 12rpx;
		right: 18rpx;
		padding: 0 15rpx;
		height: 36rpx;
		font-size: 20rpx;
		color: #FCAE32;
		background: #FFF4E1;
		border-radius: 18rpx;
		border: 2rpx solid #FFEDD0;
	}

	.tags_pos_3 {
		position: absolute;
		right: 12rpx;
		bottom: 12rpx;
		padding: 0 12rpx;
		height: 28rpx;
		line-height: 28rpx;
		font-size: 20rpx;
		color: #fff;
		background: rgba(0, 0, 0, 0.38);
		border-radius: 14rpx;
		z-index: 2;
	}

	.label_1 {
		display: block;
		padding: 0 12rpx;
		height: 28rpx;
		line-height: 28rpx;
		font-size: 20rpx;
		color: #555;
		background-color: #F3F4F7;
		border-radius: 4rpx;
		margin-right: 8rpx;
	}

	.menu_box_fix {
		position: fixed;
		left: 50%;
		bottom: calc(185rpx + env(safe-area-inset-bottom));
		height: 76rpx;
		padding: 0 12rpx;
		background: #F9F9F9;
		box-shadow: 0px 0px 20px 0px rgba(93, 93, 93, 0.5);
		border-radius: 38rpx;
		border: 1px solid #EEEEEE;
		z-index: 971;
		transform: translateX(-50%);
	}

	.menu_box_fix .item_menu {
		min-width: 150rpx;
		height: 60rpx;
		line-height: 60rpx;
		text-align: center;
		font-size: 24rpx;
		color: #000;
		background-color: transparent;
		border-radius: 30rpx;
	}

	.menu_box_fix .item_menu.active {
		color: #fff;
		background-color: #000;
	}

	.line_ver_gird {
		position: relative;
		width: 10rpx;
		height: 48rpx;
		background-image: linear-gradient(#22DDB2, #009FF5);
		border-radius: 10rpx;
	}

	.picker_arw_pos {
		position: absolute;
		top: 50%;
		right: 25rpx;
		width: 24rpx;
		height: 24rpx;
		z-index: 2;
		transform: translateY(-50%);
	}

	/* 底部菜单栏 */
	.menu_bottom_fix {
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		padding-top: 46rpx;
		z-index: 971;
	}

	.menu_bottom_fix .top_bg {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 46rpx;
		z-index: 2;
	}

	.menu_bottom_bg {
		position: relative;
		width: 100%;
		padding-bottom: env(safe-area-inset-bottom);
		height: calc(95rpx + env(safe-area-inset-bottom));
		background-color: #fff;
		z-index: 3;
	}

	.menu_add_pos {
		position: absolute;
		top: -28rpx;
		left: 50%;
		width: 68rpx;
		height: 68rpx;
		transform: translateX(-50%);
		z-index: 3;
	}

	/* 底部菜单栏 */


	/* 筛选弹窗 */
	radio,
	checkbox {
		-webkit-transform: scale(0.7);
		transform: scale(0.7);
	}

	/* 自定义导航栏 */
	.navbar {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		background: #fff;
		z-index: 10000;
		overflow: hidden;
	}

	.search_btn_sty {
		position: relative;
		width: 64rpx;
		height: 64rpx;
	}

	.back_prev_btn {
		position: relative;
		top: 50%;
		display: block;
		border-style: solid;
		width: 20rpx;
		height: 20rpx;
		border-width: 6rpx 6rpx 0 0;
		border-color: #fff;
		transform: matrix(-0.71, -0.71, 0.71, -0.71, 0, 0);
		margin-left: 56rpx;
		margin-top: -10rpx;
	}

	// .more_read_h {
	// 	position: relative;
	// 	height: 215rpx;
	// 	overflow: hidden;
	// }

	// .showMore.more_read_h {
	// 	height: auto;
	// }

	.ml-14 {
		margin-left: -14rpx;
	}

	.more_read_h .img_size_list {
		width: 136rpx;
		height: 136rpx;
		border-radius: 16rpx;
		object-fit: cover;
		margin-left: 14rpx;
		margin-bottom: 14rpx;
	}

	.more_read_h .mask_bg_pos {
		position: absolute;
		left: 0;
		bottom: 0;
		padding-bottom: 25rpx;
		display: flex;
		align-items: flex-end;
		justify-content: center;
		width: 100%;
		height: 150rpx;
		background: -webkit-linear-gradient(top, rgba(249, 249, 249, 0) 0%, #F9F9F9 100%);
		z-index: 3;
	}

	.more_read_h .close_mask.mask_bg_pos {
		display: none;
	}

	.more_read_h .mask_bg_pos .more_img {
		width: 32rpx;
		height: 32rpx;
	}

	.live {
		width: 94%;
		height: 180rpx;
		background-color: #000000;
		margin-left: 3%;
		border-radius: 15rpx;
		margin-top: 20rpx;
		overflow: hidden;
		position: relative;
	}

	.live image {
		display: block;
		width: 100%;
		height: 180rpx;
	}

	.livebox {
		position: absolute;
		left: 0px;
		top: 0px;
		width: 100%;
		height: 180rpx;
		padding: 10rpx 10rpx 0 120rpx;
		z-index: 2;
	}

	.live_title {
		width: 100%;
		color: #fff;
		padding-left: 90rpx;
		padding-top: 15rpx;
		font-size: 30rpx;
		line-height: 36rpx;
	}

	.live_footer {
		width: 100%;
		margin-left: 90rpx;
		margin-top: 40rpx;
	}

	.live_footer image {
		width: 240rpx;
		height: 40rpx;
	}

	.live_audio {
		display: inline-block;
		float: left;
		margin-left: 15rpx;
	}



	.live_audio view {
		display: inline-block;
		width: 5rpx;
		height: 30rpx;
		line-height: 30rpx;
		margin-left: 5rpx;
		background-color: #fff;
		/* float: left; */
	}

	.first {
		height: 8px;
		animation: first 0.5s linear 0s infinite alternate;
	}

	.second {
		height: 4px;
		animation: second 1s linear 0s infinite alternate;
	}

	.three {
		height: 6px;
		animation: three 0.8s linear 0s infinite alternate;
	}

	.bg_transparent {
		background-color: #333;
		opacity: 0.8;
		color: #FFF;
		border-radius: 20rpx;
		text-align: center;
	}

	@keyframes first {
		0% {
			height: 4px;
		}

		50% {
			height: 8px;
		}

		100% {
			height: 10px;
		}
	}

	@keyframes second {
		0% {
			height: 12px;
		}

		50% {
			height: 9px;
		}

		100% {
			height: 7px;
		}
	}

	@keyframes three {
		0% {
			height: 14px;
		}

		50% {
			height: 12px;
		}

		100% {
			height: 10px;
		}
	}

	/* 直播预告 */
	.live2 {
		display: block;
		height: 180rpx;
		background-color: #000000;
		border-radius: 15rpx;
		margin-top: 20rpx;
		overflow: hidden;
		position: relative;
		margin-left: 30rpx;
		margin-right: 30rpx;
	}

	.live2 image {
		display: block;
		width: 100%;
		height: 180rpx;
	}

	.livebox2 {
		position: absolute;
		left: 0px;
		top: 0px;
		width: 100%;
		height: 180rpx;
		padding: 10rpx 10rpx 0 220rpx;
		z-index: 2;
	}

	.live_title2 {
		color: #fff;
		// padding-top: 15rpx;
		font-size: 30rpx;
		margin-top: 15rpx;
	}

	.live_footer2 {
		margin-top: 20rpx;
		color: #FFF;
	}

	.live_footer2 image {
		display: block;
		width: 140rpx;
		height: 40rpx;
		margin-top: 10rpx;
	}

	.yugao_t {
		display: inline-block;
		width: 115rpx;
		height: 40rpx;
		line-height: 40rpx;
		text-align: center;
		font-size: 22rpx;
		color: #fff;
		background: #ef6030;
		border-radius: 20rpx;
		margin-right: 10rpx;
	}

	.yugao_w {
		font-size: 26rpx;
		color: #fff;
	}


	.shop_live {
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%;
		border: 2rpx solid #c644eb;
		position: fixed;
		right: 20rpx;
		top: 250rpx;
		z-index: 7;
	}

	.shop_live_ico {
		width: 90rpx;
		height: 90rpx;
		border-radius: 50%;
		/* overflow: hidden; */
		margin: 5rpx auto;
		position: relative;
	}

	.shop_live_ico image {
		display: block;
		width: 90rpx;
		height: 90rpx;
		border-radius: 50%;
	}

	.shop_live_audio_box {
		width: 100%;
		float: left;
		height: 35rpx;
		padding-top: 0rpx;
		background-image: linear-gradient(to bottom right, #d84088, #c644eb);
		color: #fff;
		border-radius: 45rpx;
		position: absolute;
		bottom: -15rpx;
		left: 0rpx;
	}

	.shop_live_audio {
		display: inline-block;
		float: left;
		margin-left: 8rpx;
	}

	.shop_live_word {
		display: inline-block;
		font-size: 16rpx;
		color: #fff;
		margin-left: 5rpx;
		height: 30rpx;
		line-height: 35rpx;
		float: left;
	}

	.shop_live_audio view {
		display: inline-block;
		width: 5rpx;
		height: 30rpx;
		line-height: 30rpx;
		margin-left: 5rpx;
		background-color: #fff;
		/* float: left; */
	}

	.shop_live_audio .first {
		height: 5px;
		animation: first 0.5s linear 0s infinite alternate;
	}

	.shop_live_audio .second {
		height: 3px;
		animation: second 1s linear 0s infinite alternate;
	}

	.shop_live_audio .three {
		height: 5px;
		animation: three 0.8s linear 0s infinite alternate;
	}

	@keyframes first {
		0% {
			height: 4px;
		}

		50% {
			height: 8px;
		}

		100% {
			height: 10px;
		}
	}

	@keyframes second {
		0% {
			height: 12px;
		}

		50% {
			height: 9px;
		}

		100% {
			height: 7px;
		}
	}

	@keyframes three {
		0% {
			height: 14px;
		}

		50% {
			height: 12px;
		}

		100% {
			height: 10px;
		}

	}

	.live_footer2 image {
		display: block;
		width: 140rpx;
		height: 40rpx;
		margin-top: 10rpx;
	}

	.yugao_t {
		display: inline-block;
		background-color: #f9e7e9;
		font-size: 26rpx;
		color: #de545c;
		text-align: center;
		height: 40rpx;
		line-height: 40rpx;
		padding: 0 15rpx;
		margin-right: 10rpx;
	}

	.yugao_w {
		font-size: 26rpx;
		color: #fff;
	}


	.shop_live {
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%;
		border: 2rpx solid #c644eb;
		position: fixed;
		right: 20rpx;
		top: 250rpx;
		z-index: 7;
	}

	.shop_live_ico {
		width: 90rpx;
		height: 90rpx;
		border-radius: 50%;
		/* overflow: hidden; */
		margin: 5rpx auto;
		position: relative;
	}

	.shop_live_ico image {
		display: block;
		width: 90rpx;
		height: 90rpx;
		border-radius: 50%;
	}

	.shop_live_audio_box {
		width: 100%;
		float: left;
		height: 35rpx;
		padding-top: 0rpx;
		background-image: linear-gradient(to bottom right, #d84088, #c644eb);
		color: #fff;
		border-radius: 45rpx;
		position: absolute;
		bottom: -15rpx;
		left: 0rpx;
	}

	.shop_live_audio {
		display: inline-block;
		float: left;
		margin-left: 8rpx;
	}

	.shop_live_word {
		display: inline-block;
		font-size: 16rpx;
		color: #fff;
		margin-left: 5rpx;
		height: 30rpx;
		line-height: 35rpx;
		float: left;
	}

	.shop_live_audio view {
		display: inline-block;
		width: 5rpx;
		height: 30rpx;
		line-height: 30rpx;
		margin-left: 5rpx;
		background-color: #fff;
		/* float: left; */
	}

	.shop_live_audio .first {
		height: 5px;
		animation: first 0.5s linear 0s infinite alternate;
	}

	.shop_live_audio .second {
		height: 3px;
		animation: second 1s linear 0s infinite alternate;
	}

	.shop_live_audio .three {
		height: 5px;
		animation: three 0.8s linear 0s infinite alternate;
	}

	@keyframes first {
		0% {
			height: 4px;
		}

		50% {
			height: 8px;
		}

		100% {
			height: 10px;
		}
	}

	@keyframes second {
		0% {
			height: 12px;
		}

		50% {
			height: 9px;
		}

		100% {
			height: 7px;
		}
	}

	@keyframes three {
		0% {
			height: 14px;
		}

		50% {
			height: 12px;
		}

		100% {
			height: 10px;
		}

	}

	// 新优化
	.navbar {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		background: #fff;
		z-index: 10000;
		overflow: hidden;
	}

	.tags_pos_4 {
		position: absolute;
		left: 0;
		bottom: -26rpx;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		height: 20rpx;
		font-size: 18rpx;
		color: #888;
		//background: linear-gradient(270deg, #30DBBB 0%, #019EF8 100%);
		border-radius: 8rpx;
		z-index: 2;
	}

	.tags_pos_5 {
		position: absolute;
		top: 14rpx;
		left: 12rpx;
		padding: 0 12rpx;
		height: 38rpx;
		line-height: 38rpx;
		font-size: 20rpx;
		color: #fff;
		background: rgba(0, 0, 0, .3);
		border-radius: 8rpx;
	}

	.search_area_sty {
		position: relative;
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		padding: 0 24rpx;
		width: 100%;
		height: 64rpx;
		font-size: 24rpx;
		color: #555;
		background: #fff;
		border-radius: 32rpx;
	}

	.top_img_pos {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 1340rpx;
		background: linear-gradient(180deg, rgba(3, 160, 246, 0.08) 0%, rgba(40, 208, 198, 0.01) 100%);
		// z-index: 1;
	}

	.screen_area_sty {
		background: #FFFFFF;
		box-shadow: 0px 0px 20rpx 0px rgba(0, 0, 0, 0.1);
		border-radius: 30rpx 30rpx 0px 0px;
	}

	.screen_area_sty .new_tab_box {
		position: relative;
		background: #F9F9F9;
		border-radius: 30rpx 30rpx 0px 0px;
	}

	.screen_area_sty .new_tab_box .item_tab {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 100rpx;
		font-size: 32rpx;
		color: #999;
	}

	.screen_area_sty .new_tab_box .item_tab::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 0;
		width: 1px;
		height: 60rpx;
		background-color: #EEEEEE;
		z-index: 1;
		transform: translateY(-50%);
	}

	.screen_area_sty .new_tab_box .item:last-child .item_tab::after {
		display: none;
	}

	.screen_area_sty .new_tab_box .item_tab.active {
		color: #333;
		font-weight: bold;
		background: #fff;
	}

	.screen_area_sty .new_tab_box .item_tab .arw_img {
		display: none;
		position: absolute;
		left: 50%;
		bottom: 16rpx;
		width: 24rpx;
		height: 12rpx;
		vertical-align: top;
		margin-left: -12rpx;
	}

	.screen_area_sty .new_tab_box .item_tab.active .arw_img {
		display: block;
	}

	.screen_area_sty .new_tab_box .item:first-child .item_tab {
		border-radius: 30rpx 0 0 0;
	}

	.screen_area_sty .new_tab_box .item:last-child .item_tab {
		border-radius: 0 30rpx 0 0;
	}

	.new_waterfall_flow_box {
		padding-top: 5rpx;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: space-between;
	}

	.new_waterfall_flow_box .flow_item_n {
		margin-bottom: 20rpx;
		width: 340rpx;
	}

	.list_box_n {
		position: relative;
		width: 340rpx;
		border: 2rpx solid #eee;
		border-radius: 8rpx;
		overflow: hidden;
	}

	.list_box_n .onself_img_size {
		width: 100%;
		height: 594rpx;
		object-fit: cover;
	}

	.list_box_n .img_size {
		width: 100%;
		height: 340rpx;
		object-fit: cover;
	}

	.content_h_n {
		height: 56rpx;
		line-height: 28rpx;
		font-size: 24rpx;
		color: #333;
		text-align: left;
		overflow: hidden;
	}

	.label_box_n_1 {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 15rpx;
		height: 30rpx;
		font-size: 20rpx;
		color: #999;
		background: #F9F9F9;
		border-radius: 4rpx;
		border: 2rpx solid #EEEEEE;
	}

	.new_head_portrait {
		position: relative;
		width: 36rpx;
		height: 36rpx;
		border: 2rpx solid #EEEEEE;
		border-radius: 50%;
	}

	// 新的底部菜单栏
	.menu_bottom_fix_new {
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		padding-top: 46rpx;
		z-index: 972;
	}

	.menu_bottom_bg_new {
		position: relative;
		width: 100%;
		padding-bottom: env(safe-area-inset-bottom);
		height: calc(100rpx + env(safe-area-inset-bottom));
		background-color: #fff;
		border-top: 2rpx solid #f0f0f0;
		z-index: 3;
	}

	.menu_bottom_bg_new .menu_fz {
		// margin-top: 10rpx;
		font-size: 20rpx;
		color: #999;
	}

	.menu_bottom_bg_new .active .menu_fz {
		background: linear-gradient(140deg, #019EF8 0%, #30DBBB 100%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.menu_box_fix_new {
		position: fixed;
		left: 50%;
		bottom: calc(115rpx + env(safe-area-inset-bottom));
		height: 72rpx;
		padding: 0 8rpx;
		background: rgba(255, 255, 255, .9);
		box-shadow: 0px 0px 20px 0px rgba(93, 93, 93, 0.5);
		border-radius: 38rpx;
		z-index: 972;
		transform: translateX(-50%);
	}

	.menu_box_fix_new .item_menu_new {
		padding: 0 5rpx;
		min-width: 94rpx;
		height: 60rpx;
		line-height: 60rpx;
		text-align: center;
		font-size: 24rpx;
		border-radius: 30rpx;
		white-space: nowrap;
		font-weight: bold;
		background: linear-gradient(140deg, #019EF8 0%, #30DBBB 100%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		margin-left: 6rpx;
		margin-right: 6rpx;
	}

	.menu_box_fix_new .item_menu_new.active {
		color: #fff;
		-webkit-text-fill-color: #fff;
		background: linear-gradient(140deg, #019EF8 0%, #30DBBB 100%);
	}

	.selected_list {
		position: relative;
		width: 100%;
		white-space: nowrap;
	}

	.selected_list .item_sele {
		display: inline-block;
		height: 118rpx;
		text-align: center;
		margin-right: 40rpx;
	}

	.screen_area_new {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 15rpx;
		min-width: 115rpx;
		height: 60rpx;
		font-size: 24rpx;
		color: #999;
		background: #F9F9F9;
		border-radius: 30rpx;
	}

	.current.screen_area_new {
		color: #333;
		font-weight: bold;
	}

	.back_top_fix {
		position: fixed;
		right: 3%;
		bottom: calc(115rpx + env(safe-area-inset-bottom));
		z-index: 972;
	}

	.back_top_fix .img_size {
		width: 80rpx;
		height: 80rpx;
	}

	.user_avatar_sty {
		position: relative;
		width: 50rpx;
		height: 50rpx;
		border: 2rpx solid #fff;
		box-shadow: 0px 0px 12rpx 0px rgba(0, 0, 0, 0.08);
		border-radius: 50%;
	}

	.cir_sty_pos {
		position: absolute;
		top: 0;
		right: 6rpx;
		width: 16rpx;
		height: 16rpx;
		background: #B62729;
		border-radius: 50%;
		z-index: 2;
	}

	.release_btn_fix {
		position: fixed;
		left: 50%;
		bottom: calc(112rpx + env(safe-area-inset-bottom));
		width: 126rpx;
		height: 126rpx;
		transform: translateX(-50%);
		z-index: 972;
	}

	.opacity_mask {
		opacity: .5;
	}

	// 弹窗内的样式
	.address_item {
		position: relative;
		padding: 30rpx;
		background: #fff;
		border: 2rpx solid #F7F7F7;
		border-radius: 20rpx;
		margin-bottom: 20rpx;
	}

	.active.address_item {
		border-color: #555555;
	}

	.add_address_fz {
		position: absolute;
		top: 50%;
		right: 34rpx;
		font-size: 24rpx;
		color: #333;
		z-index: 2;
		transform: translateY(-50%);
	}

	/* 弹窗类的 */
	.popup_title_box {
		position: relative;
		height: 90rpx;
		line-height: 90rpx;
		font-size: 28rpx;
		font-weight: bold;
		color: #333;
		text-align: center;
		background: #fff;
		border-radius: 20rpx 20rpx 0 0;
	}

	.close_btn_pos {
		position: absolute;
		top: 50%;
		right: 20rpx;
		width: 40rpx;
		height: 40rpx;
		z-index: 2;
		margin-top: -20rpx;
	}

	.new_ipt_01 {
		display: inline-block;
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		text-align: right;
		font-size: 24rpx;
		color: #333;
		background: transparent;
		border: 0;
		outline: none;
	}

	.new_ipt_02 {
		display: inline-block;
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		text-align: right;
		font-size: 24rpx;
		background: transparent;
		border: 0;
		outline: none;
	}

	.new_textarea_01 {
		display: inline-block;
		width: 100%;
		height: 200rpx;
		line-height: 32rpx;
		text-align: left;
		font-size: 24rpx;
		color: #333;
		background: transparent;
		border: 0;
		outline: none;
	}

	.new_submit_btn {
		position: relative;
		display: flex;
		width: 100%;
		height: 90rpx;
		align-items: center;
		justify-content: center;
		font-size: 28rpx;
		font-weight: bold;
		color: #fff;
		background: #dddddd;
		border-radius: 16rpx;
	}

	.current.new_submit_btn {
		background: linear-gradient(140deg, #019EF8 0%, #30DBBB 100%) #DDDDDD;
	}

	.back_btn_pos {
		position: absolute;
		top: 50%;
		left: 28rpx;
		width: 40rpx;
		height: 40rpx;
		margin-top: -20rpx;
		z-index: 2;
	}

	.popup_h_scroll {
		max-height: 660rpx;
		overflow-y: auto;
	}

	.popup_area_fix {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		z-index: 1;
	}

	.cor_b7383f {
		color: #B7383F;
	}

	.corner_mask_pos {
		position: absolute;
		top: 0rpx;
		right: -25rpx;
		width: 150rpx;
		height: 87rpx;
		z-index: 2;
	}

	.share_button {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		opacity: 0;
		z-index: 2;
	}

	// 2023/7/25
	.close_popup_pos {
		position: absolute;
		top: 50%;
		right: 0;
		z-index: 2;
		transform: translateY(-50%);
	}

	.cor_F9D {
		color: #F9DFC3;
	}

	.cor_E1A {
		color: #E1AB7B;
	}

	// 2024-04-21
	.w333 {
		width: 333rpx;
	}

	.w120 {
		width: 120rpx;
	}

	.mt24 {
		margin-top: 24rpx;
	}

	.mt32 {
		margin-top: 32rpx;
	}

	.mr16 {
		margin-right: 16rpx;
	}

	.mb24 {
		margin-bottom: 24rpx;
	}

	.pt32 {
		padding-top: 32rpx;
	}

	.pb32 {
		padding-bottom: 32rpx;
	}

	.bb5 {
		border-bottom: 1px dashed #ccc;
	}

	.page_main {
		padding-top: 120rpx;
		padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
	}

	.custom-select {
		width: 690rpx;
		height: 80rpx;
		line-height: 80rpx;
		font-size: 30rpx;
		padding-left: 20rpx;
		padding-right: 20rpx;
	}

	.custom-select::after {

		content: '';
		position: absolute;
		top: 50%;
		right: 50rpx;
		width: 0;
		height: 0;
		border-left: 20rpx solid transparent;
		border-right: 20rpx solid transparent;

		transform: translateY(-50%);
	}
</style>